import { createRouter, createWebHashHistory } from 'vue-router'
import Layout from '@/views/layout/index.vue'
// 导入首页
import Home from '@/views/home/index.vue'
import useStore from '@/store'
// 创建路由实例
const router = createRouter({
    history: createWebHashHistory(),
    // 在路由切换或刷新的时候，需要滚动到页面最顶部
    scrollBehavior: () => {
        return {
            top: 0,
        }
    },
    routes: [
        {
            path: '/',
            component: Layout,
            // 首页路由
            children: [
                {
                    path: '',
                    component: Home,
                },
                // 一级分类
                {
                    path: '/category/:id',
                    component: () => import('@/views/category/index.vue'),
                },
                // 二级分类
                {
                    path: '/category/sub/:id',
                    component: () => import('@/views/category/sub.vue'),
                },
                // 商品
                {
                    path: '/goods/:id',
                    component: () => import('@/views/goods/index.vue'),
                },
                // 购物车
                {
                    path: '/cart',
                    component: () => import('@/views/cart/index.vue')
                },
                // 订单
                {
                    path: '/member/checkout',
                    component: () => import('@/views/member/pay/checkout.vue')
                },
                // 支付
                {
                    path: '/member/pay',
                    component: () => import('@/views/member/pay/index.vue')
                },
                // 支付结果
                {
                    path: '/pay/callback',
                    component: () => import('@/views/member/pay/callback.vue')
                },
                // 个人中心
                {
                    path: '/member',
                    component: () => import('@/views/member/layout/index.vue'),
                    children: [
                        {
                            path: '',
                            component: () => import('@/views/member/home/index.vue')
                        },
                        {
                            path: 'order',
                            component: () => import('@/views/member/order/index.vue')
                        }
                    ]
                }
            ],
        },
        {
            path: '/login',
            component: () => import('@/views/login/index.vue'),
        },
        {
            path: '/playground',
            component: () => import('@/views/playground/index.vue'),
        },
        // 测试
        {
            path: '/login/callback',
            component: () => import('@/views/login/callback.vue')
        },
        
    ],
})

// 配置路由导航守卫，拦截 /member 开头的所有的地址
router.beforeEach((to, from, next) => {
    // 判断用户登没登录
    const { cart } = useStore()
    if (cart.isLogin) {
        // 已登录就放行
        next()
    } else {
        if (to.path.includes('/member')) {
            next({
                path: '/login',
                // 增加回跳的 url 地址
                query: {
                    // 传参给路由,记录跳转之前的路由地址，以便重新跳转回来
                    redirectUrl: to.fullPath,
                },
            })
        } else {
            next()
        }
    }
})

export default router